
/* 公共属性 start */
.shoppingCart a.btn:hover {
  color: #fff !important;
}

.shoppingCart .btn {
  display: block;
  width: 60px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 5px;
  font-weight: bold;
}
/* 公共属性 end */


.shoppingCart {
  display: flex;
  justify-content: center;
}

.shoppingCart .sc-center {
  width: 1200px;
}

.shoppingCart .total-warp {
  display: flex;
}

.shoppingCart .total-warp .total {
  font-size: 20px;
  height: 40px;
  line-height: 40px;
  margin: 20px 20px 0 0;
}

.shoppingCart .total-warp .checkout {
  margin: 20px 20px 0 0;
  background-color: #0058e6;
  color: #fff;
}

.shoppingCart .list-warp {
  margin: 30px auto;
}


.shoppingCart .item {
  display: flex;
  align-items: center;
  border: 1px solid #ddd;
  margin-bottom: 10px;
}

.shoppingCart .item div:nth-child(1) {
  min-width: 110px;
}

.shoppingCart .item div:nth-child(2) {
  min-width: 490px;
}

.shoppingCart .item div:nth-child(3) {
  min-width: 100px;
}

.shoppingCart .item div:nth-child(4) {
  min-width: 150px;
}

.shoppingCart .item div:nth-child(5) {

}

.shoppingCart .item .cover {
  width: 100px;
  height: 100px;
  object-fit: cover
}


.shoppingCart .item .amount-warp {
  display: flex;
  align-items: center;
}

.shoppingCart .item .btn-num .fa {
  width: 25px;
  height: 25px;
  font-size: 25px;
}

.shoppingCart .item .amount {
  text-align: center;
  padding: 0 0;
  width: 60px;
  height: 25px;
  margin: 0 6px;
}


.shoppingCart .item .delete {
  background-color: #e60000;
  color: #fff;
}

/*


.shoppingCart .sc-cart th,
.shoppingCart .sc-cart td {
  min-width: 100px;
  height: 60px;
  text-align: center;
}








*/



/*
        <table class="sc-cart">
          <thead>
            <tr>
              <th>图片</th>
              <th>书名</th>
              <th>现价</th>
              <th></th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td><img src="image/book.jpg" width="100px" alt=""></td>
              <td>Java Web 从入门到精通</td>
              <td>￥12.10</td>
              <td class="amount-warp">
                <a href="" class="btn-num"><i class="fa fa-regular fa-square-minus"></i></a>
                <input type="text" name="" id="" class="amount" value="1">
                <a href="" class="btn-num"><i class="fa fa-regular fa-square-plus"></i></a>
              </td>
              <td><a href="" class="btn delete">删除</a></td>
            </tr>

            <tr>
              <!-- <td>图片</td> -->
              <td>Python 从入门到精通</td>
              <td>￥12.10</td>
              <td class="amount-warp">
                <a href="" class="btn-num"><i class="fa fa-regular fa-square-minus"></i></a>
                <input type="text" name="" id="" class="amount" value="1">
                <a href="" class="btn-num"><i class="fa fa-regular fa-square-plus"></i></a>
              </td>
              <td><a href="" class="btn delete">删除</a></td>
            </tr>
          </tbody>
        </table>
*/